// $('button').on('click',function(){
//    $.get('/product/home',resp=>{
//       console.log(resp)
//    })
// })
require(['./config'],()=>{
   require(['template','swiper','header','footer'],(template,Swiper,Header) => {
      class Index{
         constructor(){
            this.init()
            this.getWrap().then(() => {
               this.swiper()
            })
            this.getHotShop()
            this.getAllContent().then(()=>{
               this.changeImg()
            })
         }
         init(){
            //头部复用
            // new Header('/html/modules/header.html')
            //删除详情页id
            localStorage.removeItem('id')
         }
         //轮播图
         swiper(){
            var mySwiper = new Swiper ('.swiper-container', {
               direction: 'horizontal', // 垂直切换选项
               loop: true, // 循环模式选项
               autoplay:true,//自动循环
               autoplay: {
                  disableOnInteraction: false,
                },
               // 如果需要分页器
               pagination: {
                 el: '.swiper-pagination',
               },
               
               // 如果需要前进后退按钮
               navigation: {
                 nextEl: '.swiper-button-next',
                 prevEl: '.swiper-button-prev',
               },
               
               // 如果需要滚动条
               scrollbar: {
                 el: '.swiper-scrollbar',
               },
             })        
         }
         //上方图
         getWrap(){
            //四张图片
            //获取轮播图图片
            return new Promise(resolve => {
               $.get('/product/home',resp=>{
                  // console.log(resp)
                  if(resp.code ==0){
                     const{home_activities} = resp.data
                     const{home_carousel} = resp.data
                     $('#wrap').html(template('wrapTemplate',{
                        list:home_activities
                     }))
                     $('#swiper').html(template('swiperTemplate',{
                        carousel:home_carousel
                     }))
                     resolve()
                  } 
               })
            })
            
         }
         //热图
         getHotShop(){
            //按钮点击
            $('#next').on('click',function(){
               $('#hotShopWarp').animate({
                  left:-1218,
               },1000,function(){
                  $('#next').addClass('click')
                  $('#prev').removeClass('click')
               })
            })
            $('#prev').on('click',function(){
               $('#hotShopWarp').animate({
                  left:0,
               },1000,function(){
                  $('#next').removeClass('click')
                  $('#prev').addClass('click')
               })
            })
            //获取数据
            $.get('/product/home',resp=>{
               if(resp.code == 0){
                  const{home_hot} = resp.data
                  // console.log(home_hot)
                  $('#hotShopWarp').html(template('hotShopWarpTemplate',{
                     list:home_hot
                  }))
               }
            })
         }
         // 下方多图
         getAllContent() {
            //获取数据
            return new Promise(resolve=>{
               $.get('/product/home',resp=>{
                  if(resp.code == 0){
                     const{home_floors} = resp.data
                     const{tab_items} = resp.data.home_floors[1].tabs[0]
                     console.log(home_floors)
                     console.log(tab_items)
                     $('#allContent').html(template('allContentTemplate',{
                        list:home_floors.slice(0,5),
                        tabs:tab_items
                     }))
                  }
               })
               resolve()
            })
         }
         //切换按钮改变图
         changeImg() {
           $('#allContent').on('mouseenter','.change',function(){
               // console.log($(this).parent().prevAll('.img-box').children().eq(0))
               // $(th).find().css('z-index','1')
               let index = $(this).data('index')
               // console.log(index)
               //点击了的加一个类名 改变样式
               $(this).addClass('span-click').siblings().removeClass('span-click')
               //设置自定义属性 点击这个就找到这个的父级元素的第一个兄弟元素的下面的所有子元素
               let img = $(this).parent().prevAll('.img-box').children().eq(index)
               img.css('zIndex','1')
               img.siblings().css('zIndex','-1')

           })
         }
      }
      new Index()
   })
})
